<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head th:fragment="header">
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<link rel="shortcut icon" href="http://training-static.linesno.com/switch_run/favicon.ico" />
		<title>资产管理系统 - 企业级统一化开发平台</title>
		<link href="http://training-static.linesno.com/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
		<link href="http://training-static.linesno.com/sb-admin/css/sb-admin.css" rel="stylesheet">
		<link href="http://training-static.linesno.com/vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
		<link href="http://training-static.linesno.com/vendor/datatables/dataTables.bootstrap4.css" rel="stylesheet">
		<link href="http://training-static.linesno.com/jq-datapicker/css/foundation-datepicker.css" rel="stylesheet" type="text/css">

		<script src="http://training-static.linesno.com/vendor/jquery/jquery.min.js"></script>
		<script src="http://training-static.linesno.com/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
		<script src="http://training-static.linesno.com/layer/layer.js"></script>
		<script src="http://training-static.linesno.com/js/jquery.form/jquery.form.js"></script>
		<script src="http://training-static.linesno.com/vendor/jquery-easing/jquery.easing.min.js"></script>
		<script src="http://training-static.linesno.com/vendor/datatables/jquery.dataTables.js"></script>
		<script src="http://training-static.linesno.com/vendor/datatables/dataTables.bootstrap4.js"></script>
		
		<script type="text/javascript">
	
			  function datatable(
					  _dataId , 
					  _url , 
					  _columns , 
					  _columnDefs , 
					  ){
				  $('#'+_dataId).DataTable({
					  serverSide: true ,
					  ordering: false , 
					  searching : false ,
					  bLengthChange : false ,
					  rowNum : 15 , 
					  multiselect : true,
					  ajax : {
						  "url": _url , 
						  "dataType": "json" ,
						  "data": function (d) {
							  console.log('d = ' + d) ;
							  var searchParams = paramsBuilder() ;
							  if(searchParams){
								$.extend(d,searchParams); 
							  }
						  }
					  } ,
					  columns: _columns , 
					  columnDefs : _columnDefs , 
					  language : {
						  "sProcessing": "处理中...",
						  "sLengthMenu": "显示 _MENU_ 项结果",
						  "sZeroRecords": "没有匹配结果",
						  "sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
						  "sInfoEmpty": "显示第 0 至 0 项结果，共 0 项",
						  "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
						  "sInfoPostFix": "",
						  "sSearch": "搜索:",
						  "sUrl": "",
						  "sEmptyTable": "表中数据为空",
						  "sLoadingRecords": "载入中...",
						  "sInfoThousands": ",",
						  "oPaginate": {
							  "sFirst": "首页",
							  "sPrevious": "上页",
							  "sNext": "下页",
							  "sLast": "末页"
						  },
						  "oAria": {
							  "sSortAscending": ": 以升序排列此列",
							  "sSortDescending": ": 以降序排列此列"
						  }
					 }
				  });
			 }
		
			//搜索
			function search(_dataId){
				// $('#dataTable').draw();
				$("#"+_dataId).dataTable().fnDraw(false);
			}
				
			/**
			 * get params
			 */
			function paramsBuilder() {
				var param = {} ;
				$('#trainingSortPanel input').each(function() {
					if ($(this).val() != '' && this.name != '') {
						param[this.name] = this.value;
					}

				});
				var i = $('#trainingSearchForm input') ; 
				console.log("i = " + i) ; 
				$('#trainingSearchForm input').each(function() {
					if ($(this).val() != '' && this.name != '') {
						param[this.name] = this.value;
					}

				});
				$('#trainingSearchForm select').each(function() {
					console.log('value = ' + this.value + ' , value = ' + $(this).val());
					if ($(this).val() != null &&  $(this).val() != '' && this.name != '') {
						param[this.name] = $(this).val() ;
					}
				});
				return param ;
			}
			
		</script>

		<style type="text/css">
			.table-bordered {
				border-top: 0px !important;
				border-left: 0px !important;
				border-right: 0px !important;
			}

			.table thead th {
				border-bottom-width: 0px !important;
			}
			
			table.dataTable {
				text-align:center;	
			}
			.table thead th {
   				background: #e9ecef !important ; 
			}
			
			.sidebar{
				background-color: #232f3e;	
			}
			.bg-dark {
				background-color: #232f3e !important;
				border-bottom: 1px solid #2b2525;
				box-shadow: 4px 2px 6px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24) !important; 
			}
		</style>
	</head>
</html>
